
.imglist{display: flex; align-items: center; flex-wrap: wrap;}
.imglist .item{width: 100rpx; height: 100rpx; margin-right: 20rpx; margin-top: 20rpx;}

.listitem{display: flex; align-items: center; padding-top: 20rpx; padding-bottom: 25rpx;}
.listitem .number{width: 60rpx; height: 60rpx; line-height: 58rpx; border: 1rpx solid #e6e6e6; display: flex; align-items: center; justify-content: center; font-size: 30rpx; text-align: center; color: #666; border-radius: 100%; margin-right: 20rpx;}
.listitem .font{font-size: var(--font_cons); color: #333; flex: 1; }
.listitem .number .img{width: 32rpx; height: 32rpx; margin: auto;}


.listitem.error .number{background-color: #f34141; border-color: #f34141; color: #fff;}
.listitem.error .font{color: #f34141;}

.listitem.corrent .number{background-color: #2BB130; border-color: #2BB130; color: #fff;}
.listitem.corrent .font{color: #2BB130;}

.listitem.actived .number{background-color: #023f6b; border-color: #023f6b; color: #fff;}

.contentbox{padding: 32rpx; flex: 1; min-height: 0; height: 100%;}

.fillbox{ display: flex; align-items: center;  margin-bottom: 24rpx; font-size: 28rpx; position: relative; }
.fillbox .num{ font-size: 28rpx; width: 48rpx; position: absolute; left: 48rpx;}
.fillbox input{width: 100%; padding-left: 100rpx; border: 1rpx solid #f6f6f6; font-size: 28rpx; background-color: #F6F6F6; border-radius: 8rpx; height: 96rpx;}
.fillbox input:hover, .fillbox input:focus, .fillbox.actived input{ border-color: #023f6b; }

.textbox{display: flex; align-items: center; height: 300rpx; margin-bottom: 24rpx; font-size: 28rpx; position: relative; }
.textbox textarea{height: 100%; width: 100%; border: 1rpx solid #f6f6f6; padding: 24rpx; background-color: #F6F6F6; border-radius: 8rpx; font-size: 28rpx;}
.textbox textarea:hover, .textbox textarea:focus,.textbox.actived textarea{ border-color: #023f6b;}